<template>
	<view class="mask">
		<button class="btn" size="mini" type="primary" @tap="open">点击显示遮罩</button>
		<masksLayer ref="masks" :show="show" @click="show=false">
			<view class="box">就是一个简单的遮罩层</view>
		</masksLayer>
	</view>
</template>

<script>
	import masksLayer from '@/components/mask.vue'
	export default {
		components:{ masksLayer },
		data(){
			return {
				show:false
			}
		},
		methods:{
			open(){
				this.show = true
				// console.log(this.$refs.masks)
			}
		}
	}
</script>

<style lang="scss" scoped>
	.btn{position: fixed;left: 50%;top: 20%;transform: translate(-50%,-50%);}
	.box{color: #fff;}
</style>
